<template>
	<view class="update">
		<p-navbar title="添加API">
			<!-- <text @tap="getvalue">解绑</text> -->
		</p-navbar>
		<!-- <view class="update-flex" v-for="(item,index) in list" :key="index">
			<view class="update-value">
				{{item.name}}
			</view>
			<input  :placeholder="'请输入'+item.name" v-model="form[item.key]"/>
		</view> -->
		<view class="" v-for="(item,index) in list" :key="index">
			<view class="api-time">
				{{item.name}}
			</view>
			<view class="update-flex" >
				<input style="line-height: 80rpx;padding-bottom: 20rpx;" :placeholder="'请输入'+item.name" v-model="form[item.key]"/>
			</view>
		</view>
		
		<view class="api-time">
			API有效期
		</view>
		<view class="update-flex" >
			<input v-model="form.residueDay" />
			<view class="api-text">
				天
			</view>
			
		</view>
		<view class="submit">
			<u-button type="primary" ripple shape="circle"  :loading="loading" @click="fnRegister">{{this.form.id?'解 绑':'添 加'}}</u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				loading:false,//防止多次点击
				list:[
					{
						name:'AccessKey',
						key:'apiKey'
					},
					{
						name:'SecretKey',
						key:'secretKey'
					}
				],
				form:{
					residueDay:90,
					// apiKey:'8995e915-ht4tgq1e4t-697d8f09-2ed91',
					// secretKey:'3a4e64a8-ef82b670-edb59ebf-4cf20'
				},
				type:''
			};
		},
		onLoad() {
			let data=JSON.parse(this.$Route.query.type)
			if(data.apiKey){//修改进入
				this.form.terraceId=data.terraceId//平台ID
				this.form.apiKey=data.apiKey//apiKeyID
				this.form.secretKey=data.secretKey//secretKeyID
				this.form.residueDay=data.residueDay//天数
				this.form.id=data.id//id
			}else{//初始化
				this.form.terraceId=JSON.parse(data)//平台ID
			}
			this.form.userId=uni.getStorageSync('Login').id;//获取用户id
		},
		methods:{
			getvalue(){//解绑
				
			},
			fnRegister(){//添加修改
				this.loading=true
				let method=null;//接口名
				let form={}//参数
				if(this.form.id){//解绑
				   method='userKey/delete?id='+this.form.id
				   // form.id=this.form.id
				}else{//添加
					method='userKey/insertOrUpdate'
					form=this.form
				}
				this.request.post(method,{
					...form,
				}).then(res=>{
					if(res.data.code===1){
						let toast=this.form.id?'解绑成功':'添加成功'
						this.util.toast(toast,'success')
						setTimeout(()=>{
							this.$Router.pushTab({
								path: '/pages/home/home'
							})
						},1500)
					}
					this.loading=false
				})
			},
		}
	}
</script>

<style lang="scss">
.update{
	padding: 30rpx;
.update-flex{
	@include flex;
	justify-content: space-between;
	line-height: 80rpx;
	border-bottom: 1rpx solid $border;
	margin-bottom: 15rpx;
	input{
		width: 92%;
		line-height: 60rpx;
		padding-top: 20rpx;
		// border: 1px solid red;
	}
	.update-value{
		font-size: 36rpx;
	}
}
	.api-time{
		font-size: 36rpx;
		margin-top: 70rpx;
	}
	.api-text{
		font-size: 36rpx;
		color: $color-fu;
	}
}
.submit {
		margin: 350rpx 0rpx 50rpx;
		// position: fixed;
		// background-color: $color-bgs;
		/deep/ .u-btn {
			background-color: $light-color;
			transition: .3s;
			height: 90rpx;
			border-radius: 20rpx;
			&[disabled] {
				box-shadow: none !important;
				background-color: #D7D7D7 !important;
			}
		}
		/deep/ .u-round-circle::after {
			border-radius: 20rpx;
		}
	}
</style>
